<!doctype html>
<!-- The DOCTYPE declaration above will set the    -->
<!-- browser's rendering engine into               -->
<!-- "Standards Mode". Replacing this declaration  -->
<!-- with a "Quirks Mode" doctype may lead to some -->
<!-- differences in layout.                        -->

<html>
  <head>
    <script src='/_ah/channel/jsapi'></script>
    <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <!--                                                               -->
    <!-- Consider inlining CSS to reduce the number of requested files -->
    <!--                                                               -->
    <link type="text/css" rel="stylesheet" href="/css/Tetrinet_gae.css">

    <!--                                           -->
    <!-- Any title is fine                         -->
    <!--                                           -->
    <title>Tetrinet</title>
    
    <!--                                           -->
    <!-- This script loads your compiled module.   -->
    <!-- If you add any GWT meta tags, they must   -->
    <!-- be added before this line.                -->
    <!--                                           -->
    <script type="text/javascript" language="javascript" src="tetrinet_gae/tetrinet_gae.nocache.js"></script>
  </head>
  

  <!--                                           -->
  <!-- The body can have arbitrary html, or      -->
  <!-- you can leave the body empty if you want  -->
  <!-- to create a completely dynamic UI.        -->
  <!--                                           -->
  
<body onkeydown="return checkShortcut()">

    <!-- OPTIONAL: include this if you want history support -->
    <iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1' style="position:absolute;width:0;height:0;border:0"></iframe>
    
    <!-- RECOMMENDED if your web app will not function without JavaScript enabled -->
    <noscript>
      <div style="width: 22em; position: absolute; left: 50%; margin-left: -11em; color: red; background-color: white; border: 1px solid red; padding: 4px; font-family: sans-serif">
        Your web browser must have JavaScript enabled
        in order for this application to display correctly.
      </div>
    </noscript>
	<div id="game_area"></div>
    <div>
    <input type="hidden" value="{{player}}" id="player"/>
    <input type="hidden" value="{{name}}" id="player_name"/>
    <input type="hidden" value="{{token}}" id="game_token"/>
    <input type="hidden" value="{{known_players}}" id="known_players"/>
    <input type="hidden" value="{{key}}" id="room"/>
    
    You are playing in the room: <a href="http://code-sandbox.appspot.com/tetrinet?key={{key}}">http://code-sandbox.appspot.com/tetrinet?key={{key}}</a> <br/>
    <br/>
    Left/Right - Move block left or right<br>
    Up - rotate block<br>
    Down - move block down one row<br>
    d - drop current special block<br>
    1 to 6 - use special block on player with #<br>
    t - press to enter chat mode<br>
    s - pressed by the game creator to start/restart game ( not implemented yet )<br>
    <br>
    Special Blocks:<br>
    A - Add a line<br>
    B - Remove special blocks<br>
    C - Clear a line<br>
    G - Cause block gravity<br>
    Q - Cause a block quake<br>
    R - Randomly clear blocks<br>
    S - Switch fields with player<br>
	O - Block bomb ( can only be used against fields which have "O"s on them as well)<br>
	N - Nuke a field ( completely clear all blocks )	<br>
    </div>
  </body>
</html>
